/**
 * @author zhangqiang
 * @data 2017/3/14
 *  地址列表
 * */
import React, { Component } from 'react'
import { connect } from 'react-redux'
import {Tabs } from 'antd-mobile'
import {getOrderList} from '../../actions/orderListActions'
import {
	ListTab,
	OrderListMsg,
	NoData
} from  '../../components/orderList'
import {FootNav} from '../../components/common'
import 'style/orderList.scss'
import style from './index.scss'
import common from '../../utils/common'
const TabPane = Tabs.TabPane;

class OrderList extends Component {
	constructor(props) {
		super(props)
		console.log(props)
		// let selectedIndex = props.selectedIndex=="JIUJIU"?1:0;
		this.state = {
			type: sessionStorage.getItem('tagIndex')||1,

			orderList:[],
			cacheArrOne:[],
			cacheArrTwo:[],
			cacheArrThree:[],

			cacheArrOneState: false,
			cacheArrTwoState: false,
			cacheArrThreeState: false,
			"selectedIndex": 1,
			"list": {
				"0": {
					"labelCode": "HOT",
					"page": 0,
					"pageSize": 10,
					"goodsList": []
				},
				"1": {
					"labelCode": "JIUJIU",
					"page": 0,
					"pageSize": 10,
					"goodsList": []
				}
			},
			isShow: true
		}
		this.handleIndexChange = this.handleIndexChange.bind(this);
	}

	/**
	 * 生命周期
	 */
	componentWillMount() {

	}
	componentWillUnmount() {
		// window.isShowVisa = true;
		// sessionStorage.setItem('getRegionType',1)
	}

	toUrl(url) {
		this.context.router.push(url);
	}

	componentDidMount() {
		common.setViewTitle('我的订单');
		this.handleIndexChange(this.state.type);
	}

	//处理Tab标签变化
	handleIndexChange(index,labelCode) {
		sessionStorage.setItem('tagIndex',index)
		this.setState({
			"selectedIndex": index,
			 isShow: true
		})
		if(index==1){
			if(this.state.cacheArrOne.length||this.state.cacheArrOneState){
			  this.setState({
				  orderList: this.state.cacheArrOne,
				  isShow: false
			  })
			}else {
				//业务类型 1查询办理中，2/查询已完成, 3 查询全部订单
				let getData={
					bizFlag: index
				}
				this.props.dispatch(getOrderList(getData,(res)=>{
					this.setState({
						orderList: res,
						isShow: false,
						cacheArrOne: res,
						cacheArrOneState: true
					})
				}))
			}
		}else if(index==2){
			if(this.state.cacheArrTwo.length||this.state.cacheArrTwoState){
				this.setState({
					orderList: this.state.cacheArrTwo,
					isShow: false
				})
			}else {
				//业务类型 1查询办理中，2/查询已完成, 3 查询全部订单
				let getData={
					bizFlag: index
				}
				this.props.dispatch(getOrderList(getData,(res)=>{
					this.setState({
						orderList: res,
						isShow: false,
						cacheArrTwo: res,
						cacheArrTwoState: true
					})
				}))
			}
		}else if(index==3){
			if(this.state.cacheArrThree.length||this.state.cacheArrThreeState){
				this.setState({
					orderList: this.state.cacheArrThree,
					isShow: false
				})
			}else {
				//业务类型 1查询办理中，2/查询已完成, 3 查询全部订单
				let getData={
					bizFlag: index
				}
				this.props.dispatch(getOrderList(getData,(res)=>{
					this.setState({
						orderList: res,
						isShow: false,
						cacheArrThree: res,
						cacheArrThreeState: true
					})
				}))
			}
		}

	}

	render() {	{/*<NoData key={headTag.key}/>*/}
		return (
			<div className={style.orderList} style={{paddingBottom: '1rem'}}>

				<ListTab
					handleIndexChange={this.handleIndexChange}
					selectedIndex={this.state.selectedIndex}
				/>
				<div style={{height: '.24rem'}}></div>
				{
					this.state.isShow?<div className={style.load}>加载中......</div>:
						this.state.orderList.length?this.state.orderList.map((orderList,orderListIndex)=>
							<OrderListMsg
								key={orderListIndex}
								orderList={orderList}
							/>
						):<NoData/>

				}

				{/*底部导航菜单start*/}
				<FootNav url="handleList" choice="2"/>
				{/*底部导航菜单end*/}
			</div>
		)
	}
}

//使用context
OrderList.contextTypes = {
	router: React.PropTypes.object.isRequired
};

OrderList.defaultProps = {
	data:[],
	index:['',''],
	headTag:[   //标签头部
		{
			name: '办理中',
			key: 1
		},{
			name: '已完成',
			key: 2
		},{
			name: '全部订单',
			key: 3
		}
	],
	orderList:[],
	list:[
		{type: '林炳新个人游港澳再签注',mony:95,orderNum:2210234745050,state:1,stateText:'预约申请中'},
		{type: '林炳新个人游港澳再签注',mony:95,orderNum:2210234745050,state:1,stateText:'预约申请中'},
		{type: '林炳新个人游港澳再签注',mony:95,orderNum:2210234745050,state:1,stateText:'预约申请中'}
	]
};

function mapStateToProps(state) {
	return Object.assign({}, state.orderList);
}

export default connect(mapStateToProps)(OrderList)